<div id="secondary" class="widget-area">
    <aside class="box">
        <h3 class="title"><i class="fa fa-bars"></i>热度点击</h3>
        <div class="body">
            <ul>
                {Data:loop name="Article" limit="5" var="var" order="hit desc"}
                <li class="post">
                    <div class="thumbnail"><a href="/{$var.id}.html" pjax ><img width="60" height="60" src="{$var.img}" class="{$var.title}" srcset="{$var.img}" sizes="(max-width: 60px) 100vw, 60px"></a></div>
                    <div class="right">
                        <div class="content">
                        <div><a href="/{$var.id}.html" pjax >{$var.title}</a></div>
                        <div><span class="date">{$var.create_time|date='Y-m-d H:i:s'}</span></div>
                        </div>
                    </div>
                </li>
                {/Data:loop}
            </ul>
        </div>
    </aside>
    <aside class="box">
        <div class="body">
            <form method="get" class="pure-form" action="/Search.html" id="SearchForm">
                <div class="pure-control-group">
                    <input class="pure-input-1" id="search-kw" name="kw" type="text" placeholder="关键字" />
                    <button type="submit" class="pure-button"><span class="fa fa-search"></span></button>
                </div>
            </form>
			
			<script type="text/javascript">
				/* <![CDATA[ */
				$('#SearchForm').submit(function(){
					var kw= $('#search-kw').val();
					if (kw) {
						$.pjax.send({
							selector: "#cat option",
							container: '#content', //内容替换的容器
							title:dropdown.options[dropdown.selectedIndex].innerText + ' - 文章分类',
							data:{kw:kw}
						},'/Search.html',this);
					}
					return false;
				});
				/* ]]> */
			</script>
        </div>
    </aside>
    <aside class="box pure-form">
        <div class="body">
            <label>文章分类：</label>
            <select name="cat" id="cat" class="postform form-control" style="display: inline-block;">
                <option value="-1">选择分类</option>
                {Data:loop name="Category" module="Article" limit="all" var="var" order="id desc"}
                <option class="level-0" value="/Category/{$var.id}.html">{$var.title}</option>
                {/Data:loop}
            </select>
        </div>
        <script type="text/javascript">
            /* <![CDATA[ */
            (function() {
                var category = document.getElementById("cat");
                category.onchange = function () {
                    //location.href = category.options[category.selectedIndex].value;
					var i = category.selectedIndex,
						n = category.options[i],
						v = n.value,
						t = n.innerText;
                    if (v!="-1") {
						t= t + ' - 文章分类';
						$.pjax.send({
							selector: "#cat option",
							container: '#content', //内容替换的容器24 * 3600
							title:t
						},v,this);
                    }
                }
            })();
            /* ]]> */
        </script>
    </aside>
    <aside class="box widget_tag_cloud">
        <h3 class="title"><i class="fa fa-bars"></i>标签聚合</h3>
        <div class="body">
			<div class="tagcloud" style="height: 723px;overflow: hidden;">
				{Data:loop name="Tag" limit="all" module="Article" var="var" order="count desc"}
				<a pjax href="/Tag/{$var.name}.html" class="tag-link" title="{$var.name}"><i class="fa fa-tags"></i>{$var.name}({$var.count})</a>
				{/Data:loop}
			</div>
			<a id="TagDown" href="javascript:;" style="text-align: center;display: block;"><i class="fa fa-angle-down"></i></a>
        </div>
    </aside>
</div>